@import './config.scss';

.arrow {
  display: inline-block;
  opacity: .7;
  transition: transform .25s ease-in-out;
  font-size: 18px;

  &.up {
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-bottom: 6px solid $arrowBgColor;
  }

  &.down {
    transform: rotate(0deg);
  }

  &.right {
    transform: rotate(-90deg);
  }

  &.left {
    border-top: 4px solid transparent;
    border-bottom: 4px solid transparent;
    border-right: 6px solid $arrowBgColor;
  }
}
